<template>
  <div class="cell-btn xh-list">
    <search :auto-fixed="false"  v-model="searchText" @on-submit="getResult" placeholder="请输入项目名称查找"></search>
    <group  v-for="(item,index) in getResult" :key="index" class="group-main">
      <cell :link="{path:'/demos/z-b-publish-detail',query:{PublicMsgGUID:item.ZBPublishGUID}}" >
            <div slot="title" class="head cell-desc">{{item.CgPlanName}}</div>
            <div slot="inline-desc"  class="div-desc">
               <span class="cell-desc" >中标单位:&nbsp;<span v-html="item.ProviderNameList"></span></span>
               <span class="cell-desc">发布日期:&nbsp;{{formatDate(item.PublishTime)}}</span>
               <div class="div-date">
                 <div class="div-left">招标经办人:&nbsp;{{item.Jbr}}</div>
                 <div class="div-right">电话:&nbsp;{{item.JbrTel}}</div>
                 </div>
            </div>

      </cell>
    </group>
  </div>
</template>

<script>
import { Search, Tab, TabItem, Group, Cell, XButton, dateFormat } from 'vux'
import {ZBPublishService} from '../../service/Services.js'
import _ from 'lodash'

export default {
  name: 'CellBtn',
  components: {
    Search,
    Tab,
    TabItem,
    Group,
    Cell,
    XButton
  },
  data () {
    return {
      searchText: '',
      pageData: []
    }
  },
  methods: {
    loadData () {
      this.$vux.loading.show({
        text: '加载中...'
      })
      ZBPublishService.getZBPublish().then((res) => {
        this.$vux.loading.hide()
        this.pageData = res.Data
      }).catch((res) => {
        this.$vux.toast.show({
          text: '请求失败,请联系管理员',
          type: 'cancel',
          width: '180px'
        })
      })
    },
    formatDate (myDate) {
      var msec = myDate.match(/\d+[+]\d+/gi)
      return dateFormat(new Date(Number.parseInt(msec)), 'YYYY-MM-DD')
    }
  },
  computed: {
    getResult () {
      return _.filter(this.pageData, item => { return item.CgPlanName.indexOf(this.searchText) !== -1 })
    }
  },
  created () {
    this.loadData()
  }
}
</script>

<style scoped lang="less">
.cell-main{
  margin-top: 10px;
}
.cell-desc{
  display: block;
  margin: 5px 0px;
  word-break:keep-all;/* 不换行 */
  white-space:nowrap;/* 不换行 */
  overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
  text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
}

.head{
  font-weight: bold;
  font-size: 19px;
  color: #111111;
}

.div-date{
border-top:0.5px dashed #E4E4E4 ;
margin:15px 0 0 0;
padding-top: 10px;
}

.div-left{
  float:left;
}

.div-right{
  float:right;
}

.div-desc{
    color: #7F7F7F;
}
</style>
